<template>
  <a-layout>
    <a-layout-sider v-model="baseData.collapsed" :trigger="null" collapsible class="layout">
      <BaseMenu :baseData="baseData"/>
    </a-layout-sider>
    <a-layout>
      <a-layout-header class="layout">
        <BaseHeader :baseData="baseData"/>
      </a-layout-header>
      <a-layout-content>
        <BaseContent :baseData="baseData"/>
      </a-layout-content>
    </a-layout>
  </a-layout>
</template>
<script>
import BaseHeader from './BaseHeader.vue'
import BaseMenu from './BaseMenu.vue'
import BaseContent from './BaseContent.vue'
// 导入路由
const router = require('../../mock/router.json')
export default {
  data() {
    return {
      router,
      baseData: {
        collapsed: false,
        activeKey: '0',
        panes: [
          {
            "id": "B8204087-9FC4-416A-8467-EA0CB275BB5B",
            "name": "dashboard",
            "redirect": null,
            "path": "/dashboard/Dashboard",
            "component": "dashboard/Dashboard",
            "route": "1",
            "hidden": null,
            "meta": {
              "keepAlive": false,
              "icon": "home",
              "componentName": "Dashboard",
              "title": "首页"
            },
            "children": null
          },
        ],
      }
    };
  },
  components: {
    BaseHeader,
    BaseMenu,
    BaseContent,
  },
  mounted() {

  },
  methods: {
  }

};
</script>
<style lang="less" scoped>
  .layout {
    height: 50px;
    background: #1890ff;
  }
  .ant-layout-header {
    height: 50px;
    padding: 0;
    line-height: 50px;

  }
</style>
